<template>
  <div>
    <basic-container>
      <avue-tabs :option="option"  v-model="form" @submit="handleSubmit"> </avue-tabs>
    </basic-container>
  </div>
</template>

<script>
  import {getPageList,add,edit,del} from '@/api/shop/ShopPayment/ShopPayment';
  const tab1Form={
    group:[
      /***************************************/
      {
        column:[{
          label:"商家ID",
          labelWidth:120,
          prop:"sellerId",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        },{
          label:"微信APPID",
          labelWidth:120,
          prop:"weixinAppId",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      },
      /***************************************/
      {
        column:[{
          label:"微信密钥",
          labelWidth:120,
          prop:"weixinAppSecret",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        },{
          label:"微信商户号",
          labelWidth:120,
          prop:"weixinPartnerId",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      },
      /***************************************/
      {
        column:[{
          label:"微信商户密钥",
          labelWidth:120,
          prop:"weixinPartnerKey",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        },{
          label:"微信签名",
          labelWidth:120,
          prop:"weixinPaySignKey",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      },
      /***************************************/
      {
        column:[{
          label: "编号",
          labelWidth:120,
          prop: "id",
          hide:true,
          display:false,
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      }
      /***************************************/
    ]
  }

  const tab2Form={
    group:[
      /***************************************/
      {
        column:[{
          label:"商家ID",
          labelWidth:120,
          prop:"sellerId",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        },{
          label:"支付宝APPID",
          labelWidth:120,
          prop:"aliAppId",
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      },
      /***************************************/
      {
        column:[{
          label: "编号",
          labelWidth:120,
          prop: "id",
          hide:true,
          display:false,
          rules: [{
            required: true,
            message: "",
            trigger: "blur"
          }]
        }]
      }
      /***************************************/
    ]
  }


  export  default {
    data(){
      return{
        form:{},
        obj:{},
        option:{
          column:[{
            icon:'el-icon-info',
            label:'微信设置',
            prop:'tab1',
            option:tab1Form,
            }, {
              icon:'el-icon-info',
              label:'支付宝设置',
              prop:'tab2',
              option:tab2Form,
            }]
        }
      }
    },
    created () {
      this.handleWitch();
    },
    methods: {
      handleWitch () {
        getPageList({current: '1',size: '10'}).then(res => {
          this.tableData = res.data.data.records;
          this.dataLoda(this.tableData);
        });
      },
      dataLoda(data){
          data.forEach(item =>{
            this.obj={
              id:item.id,
              aliAppId:item.aliAppId,
              weixinAppId:item.weixinAppId,
              weixinAppSecret:item.weixinAppSecret,
              weixinPartnerId:item.weixinPartnerId,
              weixinPartnerKey:item.weixinPartnerKey,
              weixinPaySignKey:item.weixinPaySignKey,
              sellerId:item.sellerId,
            };
          });
          this.form = this.obj;
      },
      handleSubmit () {

       if (this.tableData == "" || this.tableData == null){
         add(this.form).then(res => {
           this.handleWitch();
           this.$message({
             showClose: true,
             message: "添加成功",
             type: "success"
           });
           this.handleWitch();
         })
       }else {
         edit(this.form).then(res => {
           this.$message({
             showClose: true,
             message: "修改成功",
             type: "success"
           });
           this.handleWitch();
         })
       }
      }
    }

  }


</script>
